<template>
  <div>
    <div class="text-center">
      <img
        class="mt-40 logo"
        src="../assets/img/logo@3x.png"
        alt=""
        srcset=""
      />
      <h1 class="fs-40 mt-40">创建新账号</h1>
      <h2 class="fs-28 mt-40">在此处创建您的账户</h2>
    </div>
    <div class="p-40">账号</div>
    <custom-input
      v-model="info.username"
      icon="icon-wode1"
      holder="这里输入您的用户名"
    />
    <div class="p-40">密码</div>
    <custom-input
      v-model="info.password"
      icon="icon-mimaguanli"
      holder="这里输入您的密码"
    />
    <div class="p-40">
      <van-button type="warning" block @click="handleLogin">登录</van-button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      info: {
        username: "张三丰",
        password: "123",
      },
    };
  },
  methods: {
    handleLogin() {
      this.$store.dispatch("user/userLoginAction", this.info);
    },
  },
};
</script>

<style lang="scss" scoped>
.logo {
  width: 20rem;
  height: 20rem;
}
</style>
